﻿<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html lang="en">
<!--<![endif]-->

<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <!-- Basic Page Needs
    ================================================== -->
    <title>{model.seo_title}</title>
    <meta name="keywords" content="{model.seo_keywords}" />
    <meta name="description" content="{model.seo_description}" />
    <%template src="_js.html"%>
</head>

<body>
    <div class="body-innerwrapper">
        <%template src="_header.html"%>
        <!--Breadcrumb-->
        <section id="breadcrumb" class="space">
            <div class="container">
                <div class="row">
                    <div class="col-sm-6 breadcrumb-block">
                        <h2>contact</h2>
                    </div>
                    <div class="col-sm-6 breadcrumb-block text-right">
                        <ol class="breadcrumb">
                            <li><span>You are here:</span><a href="/index.html">Home</a></li>
                            <li class="active">{model.title}</li>
                        </ol>
                    </div>
                </div>
            </div>
        </section>
        <!--Contact Us-->
        <section id="contact" class="space">
            <div class="container">
                <div class="row">
                    <div class="col-sm-4 contact-block">
                        <div class="col-sm-12 main-heading">
                            <h3>{model.title}</h3>
                        </div>
                        {model.content}
                    </div>
                    <div class="col-sm-8 contact-block">
                        <div class="col-sm-12 main-heading">
                            <h3>{model.title}</h3>
                        </div>
                        <form id="contact-form">
                            <div class="form-group col-sm-6 padding-right">
                                <input type="text" class="form-control" name="name" id="name" required placeholder="Name">
                            </div>
                            <div class="form-group col-sm-6 padding-left">
                                <input type="email" class="form-control" name="mail" id="mail" required placeholder="Email">
                            </div>
                            <div class="form-group col-sm-12 no-padding">
                                <input type="text" class="form-control" name="website" id="website" placeholder="Subject">
                            </div>
                            <div class="form-group col-sm-12 no-padding">
                                <textarea class="form-control" name="comment" id="comment" placeholder="Message"></textarea>
                            </div>
                            <div class="col-sm-12 button no-padding">
                                <input type="button" id="submit_contact" onclick="addmsg();" class="sppb-btn sppb-btn-default" value="Send Message">
                                <div id="msg" class="message"></div>
                            </div>
                            <input name="site_id" type="hidden" class="textbox" value="3">
                            <input name="keys" type="hidden" class="textbox" value="">
                        </form>
                    </div>
                </div>
            </div>
        </section>
  
        <%template src="_footer.html"%>
    </div>
    <%template src="__js.html"%>
 
</body>

</html>

<script type="text/javascript">
    $(".menu ul li").eq(4).addClass("active");
    function addmsg() {
        var name = $.trim($("input[name=name]").val());
        var mail = $.trim($("input[name=mail]").val());
        var website = $.trim($("input[name=website]").val());
        var comment = $.trim($("input[name=comment]").val());
        if (name.length < 1 || name.length > 50) {
            alert("Name length is 1-50 characters");
            return false;
        }
        if (mail.length < 1 || mail.length > 50) {
            alert("Email length is 1-50 characters");
            return false;
        }
        if (website.length < 1 || website.length > 50) {
            alert("Subject length must 11 characters ");
            return false;
        }
        if (comment.length > 500) {
            alert("Message length is 0-500 characters");
            return false;
        }

        $.ajax({
            //几个参数需要注意一下
            type: "POST",//方法类型
            // dataType: "json",//预期服务器返回的数据类型
            url: "/ashx/addmessage.ashx",//url
            data: $('#contact-form').serialize(),
            success: function (result) {
                if (result == "ok") {
                    alert("success");
                    window.location.href = "/index.html";
                } else {
                    alert(result);
                }

            },
            error: function () {
                alert("异常！");
            }
        });

    }
</script>